Skip to content

feat(ui): Mosaic field component - #9322

Draft
austincalvelage wants to merge 9 commits into
austin/mosaic-input-componentfrom
mosaic-text-field-component
Draft

feat(ui): Mosaic field component#9322
austincalvelage wants to merge 9 commits into
austin/mosaic-input-componentfrom
mosaic-text-field-component

Conversation

@austincalvelage

@austincalvelage austincalvelage commented Aug 4, 2026 •
edited
Loading

Copy link
Copy Markdown
Member

Description

https://swingset-git-mosaic-text-field-component.clerkstage.dev/components/field

CleanShot 2026-08-04 at 16 02 31@2x CleanShot 2026-08-04 at 16 01 40@2x

Adds the Mosaic Field component:

  • Adds the compound Field.Root, Field.Label, Field.Description, and Field.Error API.
  • Connects labels, descriptions, and errors to the field control with generated IDs and the appropriate aria-* attributes.
  • Shares invalid, disabled, and required state with composed Mosaic inputs.
  • Adds an alert-circle icon for validation errors.
import { Field } from '@clerk/ui/mosaic/components/field';
import { Input } from '@clerk/ui/mosaic/components/input';

<Field.Root required>
  <Field.Label>Email address</Field.Label>
  <Input
    name='email'
    type='email'
  />
  <Field.Description>Used for account notifications.</Field.Description>
</Field.Root>;

@changeset-bot

changeset-bot Bot commented Aug 4, 2026 •
edited
Loading

Copy link
Copy Markdown

🦋 Changeset detected

Latest commit: a6c399c

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 0 packages

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@vercel

vercel Bot commented Aug 4, 2026 •
edited
Loading

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
clerk-js-sandbox Ready Ready Preview Aug 4, 2026 11:03pm
swingset Ready Ready Preview Aug 4, 2026 11:03pm

Request Review

@github-actions github-actions Bot added the ui label Aug 4, 2026
@pkg-pr-new

pkg-pr-new Bot commented Aug 4, 2026 •
edited
Loading

Copy link
Copy Markdown

Open in StackBlitz

@clerk/astro

npm i https://pkg.pr.new/@clerk/astro@9322

@clerk/backend

npm i https://pkg.pr.new/@clerk/backend@9322

@clerk/chrome-extension

npm i https://pkg.pr.new/@clerk/chrome-extension@9322

@clerk/clerk-js

npm i https://pkg.pr.new/@clerk/clerk-js@9322

@clerk/electron

npm i https://pkg.pr.new/@clerk/electron@9322

@clerk/electron-passkeys

npm i https://pkg.pr.new/@clerk/electron-passkeys@9322

@clerk/eslint-plugin

npm i https://pkg.pr.new/@clerk/eslint-plugin@9322

@clerk/expo

npm i https://pkg.pr.new/@clerk/expo@9322

@clerk/expo-google-signin

npm i https://pkg.pr.new/@clerk/expo-google-signin@9322

@clerk/expo-passkeys

npm i https://pkg.pr.new/@clerk/expo-passkeys@9322

@clerk/express

npm i https://pkg.pr.new/@clerk/express@9322

@clerk/fastify

npm i https://pkg.pr.new/@clerk/fastify@9322

@clerk/hono

npm i https://pkg.pr.new/@clerk/hono@9322

@clerk/localizations

npm i https://pkg.pr.new/@clerk/localizations@9322

@clerk/nextjs

npm i https://pkg.pr.new/@clerk/nextjs@9322

@clerk/nuxt

npm i https://pkg.pr.new/@clerk/nuxt@9322

@clerk/react

npm i https://pkg.pr.new/@clerk/react@9322

@clerk/react-router

npm i https://pkg.pr.new/@clerk/react-router@9322

@clerk/shared

npm i https://pkg.pr.new/@clerk/shared@9322

@clerk/tanstack-react-start

npm i https://pkg.pr.new/@clerk/tanstack-react-start@9322

@clerk/testing

npm i https://pkg.pr.new/@clerk/testing@9322

@clerk/ui

npm i https://pkg.pr.new/@clerk/ui@9322

@clerk/upgrade

npm i https://pkg.pr.new/@clerk/upgrade@9322

@clerk/vue

npm i https://pkg.pr.new/@clerk/vue@9322

commit: ca96e1b

@austincalvelage
austincalvelage force-pushed the mosaic-text-field-component branch from 57aeff6 to fd49235 Compare August 4, 2026 20:48
@austincalvelage austincalvelage changed the title feat(ui):Mosaic text field component feat(ui): Mosaic text field component Aug 4, 2026
@austincalvelage austincalvelage changed the title feat(ui): Mosaic text field component feat(ui): Mosaic field component Aug 4, 2026
@austincalvelage
austincalvelage force-pushed the mosaic-text-field-component branch from ca96e1b to a6c399c Compare August 4, 2026 23:01
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

No reviews

Assignees

No one assigned

Labels

ui

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

1 participant

@austincalvelage